<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Bootstrap Admin Theme</title>
    <!-- Bootstrap Styles-->
    <link href="../assets/css/bootstrap.css" rel="stylesheet" />
    <!-- FontAwesome Styles-->
    <link href="../assets/css/font-awesome.css" rel="stylesheet" />

    <link href="../assets/css/select2.min.css" rel="stylesheet" >
    <link href="../assets/css/checkbox3.min.css" rel="stylesheet" >
    <!-- Custom Styles-->
    <!-- <link href="assets/css/custom-styles.css" rel="stylesheet" />-->
    <!-- Google Fonts-->
    <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css' />
</head>
<body>


<!--/. NAV TOP  -->

<div id="page-wrapper" >
    <br /><br /><br />
    <div style="left: 90%;position: relative;">
        <a href="#" class="btn btn-info" id="jqprint">打印</a>
    </div>
    <div id="print">
    <div class="header">
        <h1 class="page-header" style="text-align: center">
            物业管理 <small>（1000112）</small>
        </h1>

    </div>


    <!-- <div id="page-inner"> -->
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div class="card-title">
                        <div class="title">基本信息</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div class="card-title">
                        <div class="title">
                            <div class="panel panel-default">
                                <!--<div class="panel-heading">
                                    Basic Table
                                </div>-->
                                <div class="panel-body">
                                    <div class="table-responsive">
                                        <table class="table">

                                            <c:forEach items="${listdetails }" var="details">
                                                <tr>
                                                    <td style="text-align: right;">
                                                        报账人：
                                                    </td>
                                                    <td>
                                                        ${details.userName }
                                                    </td>

                                                    <td style="text-align: right;">
                                                        报账单位名称：
                                                    </td>
                                                    <td>
                                                        ${details.departmentName }
                                                    </td>

                                                    <td style="text-align: right;">公司代码：</td>
                                                    <td>
                                                        ${details.companyid }
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td style="text-align: right;">报账时间：</td>
                                                    <td>
                                                        ${details.reimbursementTime }
                                                    </td>

                                                    <td style="text-align: right;">
                                                        费用发生日：
                                                    </td>
                                                    <td>
                                                        ${details.invoiceTime }
                                                    </td >

                                                    <td style="text-align: right;">报账人电话：</td>
                                                    <td>
                                                        ${details.phone }
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td style="text-align: right;">
                                                        收支方式：
                                                    </td>
                                                    <td>
                                                        ${details.payments }
                                                    </td>

                                                    <td style="text-align: right;">
                                                        是否员工代垫：
                                                    </td>
                                                    <td>
                                                        ${details.isAdvance }
                                                    </td>
                                                    <td style="text-align: right;">报账单号：</td>
                                                    <td>
                                                        ${details.reimbursementId }
                                                    </td>
                                                </tr>
                                                <tr >
                                                    <td style="text-align: right;">
                                                        发票类型：
                                                    </td>
                                                    <td >
                                                        ${details.invoiceTypeName }
                                                    </td>
                                                    <td style="text-align: right;">
                                                        附单据张数：
                                                    </td>
                                                    <td >
                                                        ${details.reimbursementNumber }
                                                    </td>
                                                    <td style="text-align: right;">
                                                        是否个人专项：
                                                    </td>
                                                    <td >
                                                        ${details.isSingle }
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td style="text-align: right;">
                                                        报账说明：
                                                    </td>
                                                    <td colspan="5">
                                                        ${details.reimbursementExplain }
                                                    </td>
                                                </tr>
                                            </c:forEach>
                                        </table>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="panel-body">

                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div class="card-title">
                        <div class="title">明细信息</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div class="card-title">
                        <div class="title">
                            <div class="panel panel-default">
                                <!--<div class="panel-heading">
                                    Kitchen Sink
                                </div>-->
                                <div class="panel-body">
                                    <div class="table-responsive">
                                        <table class="table table-striped table-bordered table-hover">
                                            <thead>
                                            <tr>

                                                <th>是否使用成本/资本预算</th>
                                                <th>预算责任中心</th>
                                                <th>报账金额（含税）</th>
                                                <th>报账金额</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <c:forEach items="${listDetailInformation }" var="tDetailInfo">

                                                <tr>

                                                    <td>
                                                        ${tDetailInfo.isCostCapitalBudget }
                                                    </td>
                                                    <td >
                                                        ${tDetailInfo.预算成本中心 }
                                                    </td>
                                                    <td>
                                                        ${tDetailInfo.reimbursementMoney }
                                                    </td>
                                                    <td >
                                                        ${tDetailInfo.reimbursementMoneyOfTax }
                                                    </td>
                                                </tr>
                                            </c:forEach>


                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="panel-body">

                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div class="card-title">
                        <div class="title">其他</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <div class="card-title">
                        <div class="title">
                            <!--选项卡-->
                            <div class="panel panel-default">
                                <div class="panel-body">
                                    <ul class="nav nav-tabs">
                                        <li class=""><a href="#home" data-toggle="tab" aria-expanded="true">内部人信息</a>
                                        </li>
                                        <li class="active"><a href="#profile" data-toggle="tab" aria-expanded="false">报账单影像</a>

                                    </ul>

                                    <div class="tab-content">
                                        <div class="tab-pane fade" id="home">


                                            <!--表格-->
                                            <div class="panel panel-default">
                                                <!--   <div class="panel-heading">
                                                       Bordered Table
                                                   </div>-->

                                                <!-- /.panel-heading -->
                                                <div class="panel-body">
                                                    <div style="left: 80%; position: relative;">
                                                        <a href="#" class="btn btn-info" onclick="exportInfo()">导出</a>
                                                    </div>
                                                    <br />
                                                    <div class="table-responsive table-bordered">

                                                        <table class="table">

                                                            <thead>
                                                            <tr>
                                                                <th>序号</th>
                                                                <th>收款人</th>
                                                                <th>所属部门</th>
                                                                <th>员工编号</th>
                                                                <th>收款类型</th>
                                                                <th>公司名称</th>
                                                                <th>开户行</th>
                                                                <th>银行账号</th>
                                                                <th>金额</th>
                                                            </tr>
                                                            </thead>
                                                            <tbody>
                                                            <c:forEach items="${listOtherInformation }" var="otherInformation">
                                                                <tr>
	                                                               
	                                                                <td id="number">1</td>
	                                                                <td id="name">${otherInformation.userName }</td>
	                                                                <td id="department">${otherInformation.departmentName }</td>
	                                                                <td id="userId">${otherInformation.userId }</td>
	                                                                <td id="collection">${otherInformation.receivablesType }</td>
	                                                                <td id="companyName">${otherInformation.companyName }</td>
	                                                                <td id="bankName">${otherInformation.bankName }</td>
	                                                                <td id="bankNumber">${otherInformation.bankNumber }</td>
	                                                                <td id="money">${otherInformation.reimbursementMoney }</td>
	
	                                                            </tr>
                                                            </c:forEach>

                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                            <!--
                                                作者：1049794100@qq.com
                                                时间：2018-01-04
                                                描述：表格
                                            -->
                                        </div>
                                        <div class="tab-pane fade active in" id="profile">
                                            <div></div>
                                            &nbsp;&nbsp;
                                            <div style="margin-left: 1%;">
                                                <c:forEach  items="${imageList }" var="image">
                                            <img alt="" src="${image.enclosureUrl }">
                                            </c:forEach>
                                               <!--  <button type="button" class="btn btn-success btn-circle"><i class="fa fa-link"></i>
                                                </button> -->
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
    </div>
</div>


<!-- JS Scripts-->
<!-- jQuery Js -->
<script src="../assets/js/jquery-1.10.2.js"></script>
<script src="../js/jquery-3.2.1/jquery.jqprint-0.3.js"></script>
<script src="http://www.jq22.com/jquery/jquery-migrate-1.2.1.min.js"></script>
<!-- Bootstrap Js -->
<script src="../assets/js/bootstrap.min.js"></script>
<!-- Metis Menu Js -->
<script src="../assets/js/jquery.metisMenu.js"></script>
<script src="../assets/js/select2.full.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $(".selectbox").select2();
    });
    $("#jqprint").click(function(){
        $("#print").jqprint({
            debug: false, //如果是true则可以显示iframe查看效果（iframe默认高和宽都很小，可以再源码中调大），默认是false
            importCSS: true, //true表示引进原来的页面的css，默认是true。（如果是true，先会找$("link[media=print]")，若没有会去找$("link")中的css文件）
            printContainer: true, //表示如果原来选择的对象必须被纳入打印（注意：设置为false可能会打破你的CSS规则）。
            operaSupport: true//表示如果插件也必须支持歌opera浏览器，在这种情况下，它提供了建立一个临时的打印选项卡。默认是true
        });
    });
</script>
<!-- Custom Js -->
<script src="../assets/js/custom-scripts.js"></script>

<script type="text/javascript">
layui.use('layer', function(){
    var layer = layui.layer;
});
function exportInfo(){
	var reimbursementId = $("#reimbursementId").text();
	var number = $("#number").text();
	var name = $("#name").text();
	var department = $("#department").text();
	var collection = $("#collection").text();
	var companyName = $("#companyName").text();
	var bankName = $("#bankName").text();
	var userId = $("#userId").text();
	var bankNumber = $("#bankNumber").text();
	var money = $("#money").text();
	
	console.log(number);
	console.log(name);
	console.log(department);
	console.log(collection);
	console.log(companyName);
	console.log(bankName);
	console.log(userId);
	console.log(bankNumber);
	console.log(money);
	
	
	$.ajax({
		type:"post",
		url:"${pageContext.request.contextPath}/Excel/exportExcel.do",
		dataType:"json",
		data:{"reimbursementId":reimbursementId,"number":number
			,"name":name,"department":department,"collection":collection
			,"companyName":companyName,"bankName":bankName,"userId":userId
			,"bankNumber":bankNumber,"money":money},
		success:function(data){
			console.log("成功了");
			layer.msg("导出成功！");
		},
		error:function(data){
			layer.msg("导出失败！");
		}
	}); 
}
</script>

</body>
</html>
